<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/ui/header.jsp" %>
<style>
    .page-container {
        margin: 10px 10px;
        padding: 10px 10px;
        border-radius: 5px;
        background-color: #ffffff;
    }

    .page-table-tools {
        margin-top: 20px;
        margin-bottom: 20px;
    }
</style>
<div class="page-container">
    <div class="page-table">
        <div class="page-table-tools">
            <form class="layui-form layui-form-inline" action="">
                <div class="layui-input-inline">
                    <input type="text" name="title" placeholder="任务名称"
                           autocomplete="off" class="layui-input">
                </div>
                <button class="layui-btn layui-btn-normal">搜索</button><button class="layui-btn layui-btn-primary">新增</button>
            </form>
        </div>
        <div class="page-table-body">
            <table class="layui-hide" id="test"></table>
        </div>
        <div class="page-table-footer">
            <div id="page"></div>
        </div>
    </div>
</div>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
</script>
<script>
    layui.use('table', function () {
        var table = layui.table;
        table.render({
            elem: '#test',
            url: "/sysOrgRole/data",
            method: 'post',
            cols: [
                [
                    {field: 'fdId', title: 'ID', width: 300, sort: true, align: 'center'},
                    {field: 'fdCode', title: '角色编号', align: 'center'},
                    {field: 'fdName', title: '角色名称', align: 'center'},
                    {field: 'fdCreateTime', title: '创建时间', align: 'center'},
                    {field: 'fdUpdateTime', title: '更新时间', align: 'center'},
                    {fixed: 'right', align: 'center', title: '操作', toolbar: '#barDemo'}
                ]
            ],
            parseData: function (res) {
                return {
                    "code": 0,
                    "count": res.totalrows,
                    "data": res.list
                };
            },
            page: true
        });
    });
</script>
<%@ include file="/ui/footer.jsp" %>